<template>
  <div>
    <a-card :bordered="false" title="快捷入口">
      <a-row align="middle" :gutter="12">
        <a-col :span="3" v-for="(menu, index) in fastList" :key="index">
          <a-tooltip placement="top" :title="menu.name">
            <a-button type="primary" @click="routerFast(menu.url)" shape="round" ghost style="margin-top: 10px" block>
              <div class="text-wrap">{{ menu.name }}</div>
            </a-button>
          </a-tooltip>
        </a-col>
        <a-col :span="3">
          <a-button type="dashed" @click="handleFast" shape="round" style="margin-top: 10px" block> 编辑 </a-button>
        </a-col>
      </a-row>
    </a-card>
    <user-fast-modal ref="fastModal" @ok="getFastList"></user-fast-modal>
  </div>
</template>

<script>
import {getAction} from '@api/manage'
import {queryPermissionsByUser} from '@/api/api'
import UserFastModal from './UserFastModal'

export default {
  name: 'assessment',
  components: {
    UserFastModal,
  },
  data() {
    return {
      btnList: [],
      url: {
        getFastList: '/api/erpmng/sys/permission/queryUserQuickMenu',
      },
      fastList: [],
    }
  },
  created() {
    this.getFastList()
  },
  mounted() {},
  methods: {
    getBtnList() {
      queryPermissionsByUser()
        .then((res) => {
          console.log(res)
          this.btnList = res.result.menu
        })
        .catch((error) => {
          reject(error)
        })
    },
    routerPush(item, path, name) {
      console.log(item)
      if (item.children && item.children.length > 0) {
        path = item.children[0].path
        name = item.children[0].name
      } else {
        path = item.path
        name = item.name
      }
      this.$router.push({
        path: path,
        name: name,
      })
    },
    routerFast(path, name) {
      this.$router.push({
        path: path,
        name: name,
      })
    },
    handleFast: function () {
      this.$refs.fastModal.show()
    },
    getFastList() {
      getAction(this.url.getFastList).then((res) => {
        console.log('res', res.result)
        this.fastList = res.result
      })
    },
  },
}
</script>

<style>
.text-wrap {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
</style>